// 解构方式引入函数
const {src,dest, parallel,series} = require("gulp")
const cleancss = require("gulp-clean-css")
const rename = require("gulp-rename")
const uglify = require('gulp-uglify')
const htmlmin = require("gulp-htmlmin")
const del = require("del")
const browserSync = require("browser-sync")
const bs = browserSync.create()
 
// 声明 gulp 任务
const style = () => {
    return src("src/styles/index.css",{base: "src"})
    .pipe(cleancss())
    .pipe(rename({"extname": ".min.css"}))
    .pipe(dest("dist"))
}

// 声明 引入文件 任务
const  jQ = () => {
    return src(["src/js/jquery-1.12.4.min.js","src/js/template-native.js"],{base: "src"})
    .pipe(dest("dist"))
}

// 声明 脚本 构建任务
const script = () => {
    return src("src/scripts/index.js",{base: "src"})
    .pipe(uglify())
    .pipe(rename({ "extname": ".min.js" }))
    .pipe(dest("dist"))
}

// 声明 页面 的构建任务
const html = () => {
    return src("src/index.html")
    .pipe(htmlmin({
        collapseWhitespace: true,
        minifyCSS: true,
        minifyJS: true
    }))
    .pipe(dest("dist"))
}

// 声明 文件清除 任务
const clean = () => {
    return del(["dist"])
}

// 声明 服务发布 任务
const serve = () => {
    bs.init({
        notify: false,
        server: {
            baseDir: "./dist"
        }
    })
} 

// 组合任务
const build = parallel(style,jQ,script,html)

const dev = series(clean,build,serve)

// 导出任务 
module.exports = {
    build,
    dev,
    serve
}